body, html {
  margin: 0;
  padding: 0;
  height: 100%;
  /*font-family: Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,SimSun,sans-serif;*/
  font-family: "SF Pro SC","SF Pro Text","SF Pro Icons","PingFang SC","Helvetica Neue","Helvetica","Arial",sans-serif;
  font-weight: 400;
  font-size: 16px;
  color: #888;
  -webkit-font-smoothing: antialiased;
  overflow: hidden;
  display: block;
  /*background-color: #e8ebed;*/
}

/*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/
::-webkit-scrollbar
{
  width: 8px;
  height: 8px;
  background-color: #F5F5F5;
}

/*定义滚动条轨道 内阴影+圆角*/
::-webkit-scrollbar-track
{
  -webkit-box-shadow: inset 0 0 6px #E8EBED;
  border-radius: 10px;
  background-color: #F5F5F5;
}

/*定义滑块 内阴影+圆角*/
::-webkit-scrollbar-thumb
{
  border-radius: 10px;
  -webkit-box-shadow: inset 0 0 6px #E8EBED;
  background-color: #ccc;
}

.p-row {
 margin: 0px;
}

.p-col {
 padding: 0px;
}

.p-login {
  width: 100%;
  height: 100%;
  background: url(../img/login_bg.jpeg) no-repeat center;
  background-size: 100% 100%;
}

.p-login-input {
  text-align: center;
  margin-bottom: 20px;
}

.p-login-input input::-webkit-input-placeholder {
  color: white;
}

.p-login-input input,
.p-login-submit-button{
  width: 80%;
  height: 30px;
  line-height: 10px;
  background: transparent;
  outline: none;
  color: white;
  text-align: center;
  border: 3px solid #0095ff;
  border-radius: 20px;
  font-size: 16px;
  letter-spacing: 4px;
  /*display: flex;*/
  margin: 0 auto;
  text-align: center;
}

.p-login-input input:focus,
.p-login-input.has-text input{
  background: rgba(22, 94, 128, 0.67);
}

.p-login-submit-button {
  font-size: 20px;
  background-color: rgba(0,180,255,0.6);
  border: none;
}

.p-header {
  position: fixed;
  width: 100%;
  height: 60px;
  line-height: 60px;
  border-bottom: 1px solid #dfe4ed;
}

.p-logo {
  height: 100%;
  text-align: center;
  width: 180px;
  font-size: 18px;
  font-weight: 700;
  color: #50bfff;
  float: left;
}

.p-header-navbar {
  height: 100%;
  float: left;
}

.p-header-navbar ul {
  height: 100%;
  margin-bottom: 0px;
}

.p-header-navbar ul li {
  height: 100%;
  display: inline-block;
  padding-left: 15px;
  padding-right: 15px;
  cursor: pointer;
}

.p-header-navbar ul li:hover,
.p-header-navbar ul .actived {
  color: #50bfff;
  border-bottom: 3px solid #50bfff;
}

.p-header-right {
  float: right;
  margin-right: 15px;
}

.p-header-right span {
  cursor: pointer;
  padding-left: 10px;
}

.p-full-screen .p-header,
.p-full-screen .p-navside{
  display: none!important;
}

.p-full-screen .p-page-content {
  width: 100%!important;
  height: 100%!important;
  top: 0px!important;
  margin-left: 0px!important;
}

.p-layout .p-navside {
  width: 180px;
}

.p-layout .p-page-content {
  margin-left: 180px;
  width: calc(100% - 180px);
}

.p-no-navside .p-page-content {
  margin-left: 0px!important;
  width: 100%!important;
}

.p-navside {
  position: fixed;
  top: 60px;
  height: calc(100% - 60px);
  border-right: 1px solid #dfe4ed;
  overflow: auto;
  font-size: 14px;
}

.p-navside-toggle {
  background: rgba(221, 221, 221, 0.19);
  text-align: center;
  height: 30px;
  line-height: 30px;
  cursor: pointer;
}

.p-navside .p-menu-item-icon {
  margin-left: 20px;
  margin-right: 10px;
}

.p-navside-menu {
  padding-left: 15px;
  padding-right: 15px;
}

.p-navside-menu ul {
  margin-bottom: 0px;
  padding-left: 0px;
}

.p-navside-menu ul li{
  list-style: none;
  height: 35px;
  line-height: 35px;
  margin-top: 15px;
  margin-bottom: 15px;
  cursor: pointer;
}

.p-navside-menu ul li:hover{
  background: rgba(0, 162, 255, 0.2);
  border-radius: 20px;
  color: #FFFFFF;
}

.p-navside-menu ul .actived{
  background: #50bfff!important;
  border-radius: 20px;
  color: #FFFFFF;
}

.p-navside-stop .p-navside {
  width: 70px!important;
  text-align: center;
}

.p-navside-stop .p-navside .p-menu-item-name {
  display: none;
}

.p-navside-stop .p-navside .p-menu-item-icon {
  margin-left: 0px;
  margin-right: 0px;
}

.p-navside-stop .p-page-content {
  margin-left: 70px!important;
  width: calc(100% - 70px)!important;
}

.p-page-content {
  padding: 15px;
  position: absolute;
  top: 60px;
  height: calc(100% - 60px);
  overflow: auto;
}

.p-full-page {
  padding: 15px;
  position: absolute;
  width: 100%;
  height: 100%;
  overflow: auto;
}

button {
  border-radius: 20px!important;
}

button .fa {
  margin-right: 5px;
}

.p-panel-head {
  max-height: 45px;
}

.p-panel-head .p-panel-title,
.p-panel-head .p-panel-head-right {
  /*height: 45px;*/
  /*line-height: 45px;*/
  /*position: relative;*/
}

.p-panel-title {
  padding-left: 10px;
}

.p-panel-head-right {
  padding-right: 10px;
}

.p-panel-content {
  padding: 10px;
  box-shadow: 0px 0px 6px 2px #eee;
  border-radius: 5px;
}

.p-scene-list {
  padding: 50px 100px;
}

.p-scene-panel {
  width: 140px;
  height: 250px;
  float: left;
  position: relative;
  margin-right: 10px;
  margin-bottom: 10px;
  box-shadow: 0px 0px 6px 2px #eee;
  cursor: pointer;
}

.p-middle {
  display: flex;
  justify-content: center;
  align-items: center;
}

.p-scene-add {
  text-align: center;
  background-color: #50bfff;
  color: white;
  font-weight: 700;
}

.p-scene-item .p-scene-item-data,
.p-scene-item .p-scene-item-action {
  padding: 5px;
  position: absolute;
  width: 100%;
  height: 100%;
}

.p-scene-item:hover .p-scene-item-action {
  display: flex;
}

.p-scene-item-action {
  display: none;
  z-index: 100;
  text-align: center;
  background-color: rgba(0, 162, 255, 0.57);
}

.p-scene-item-action .el-button{
   background: none;
   color: white;
   border: 1px solid white;
 }

.p-scene-item-action .el-button:hover{
  color: #409EFF;
  background-color: #FFFFFF;
}

.p-scene-item-action-button {
  margin-bottom: 10px;
}

.p-scene-item-title {
  width: 100%;
  text-align: center;
  font-weight: 700;
  height: 44px;
}

.p-scene-item-icon {
  width: 100%;
  height: 100px;
  line-height: 110px;
  text-align: center;
  color: #eb9e05;
}

.p-scene-item-detail {
  font-size: 12px;
}

.p-scene-item-desc {
  width: 100%;
  height: 52px;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}

.p-scene-item-bottom {
  height: 34px;
  width: 100%;
  padding-top: 15px;
  /*text-align: center;*/
}

.p-scene-loadmore {
  text-align: center;
  line-height: 250px;
}

.p-scene-loadmore:hover {
  color: white;
  background-color: rgba(0, 162, 255, 0.57);
}

.p-map {
  height: calc(100% + 30px);
  margin: -15px;
}

.BMapLabel {
  margin-bottom: 0px!important;
  max-width: none!important;
}

.p-map-left-panel {
  position: absolute;
  top: 30px;
  left: 30px;
  z-index: 100;
  background-color: #FFFFFF;
}

.p-map-right-panel {
  position: absolute;
  top: 30px;
  right: 30px;
  z-index: 100;
  background-color: #FFFFFF;
}

.legendInfo {
  background: #fff;
  line-height: 30px;
  font-size: 12px;
  width:fit-content;
}

.legendInfo > ul {
  margin-bottom: 0px;
  padding: 8px 10px 10px 10px;
  width:fit-content;
}

.legendInfo > ul > li{
  line-height: 0px;
  vertical-align: top;
  width:fit-content;
  list-style-type: none;
}

.legendInfo > ul > li:hover{
  cursor: pointer;
}

.legend-label{
  float: left;
  width: 10px;
  height: 10px;
  padding-top: 0px;
  margin: 7px 0px 0px 0px;
}

.legend-name{
  font-size: 12px;
  padding: 0px 0px 0px 15px;
  margin: 0px;
  width:fit-content;
}


.legend-label-long{
  float: left;
  width: 25px;
  height: 15px;
  padding-top: 0px;
  margin: 7px 0px 0px 0px;
}

.legend-name-long{
  height: 25px;
  line-height: 30px;
  font-size: 12px;
  padding: 0px 0px 0px 35px;
  margin: 0px;
  width:fit-content;
}
